<template>
    <div class="component-setting">
        <div class="row" v-for="(item, key) in data" :key="key">
            <new-cell-group :list="item" />
        </div>
        <div class="logout" @click="onLogout">退出登陆</div>
    </div>
</template>

<style lang="less" scoped>
    @import '../../../style/variable';
    .component-setting{
        background-color: #f8f8f8;
        padding-bottom: 10rem;
        .row:nth-of-type(4), .row:nth-of-type(8) {
            margin-bottom: 0.8rem;
        }
        .logout {
            height: 4.4rem;
            line-height: 4.4rem;
            font-size: 1.6rem;
            text-align: center;
            color: #000;
            background: @color-white;
        }
    }
</style>

<script>
    import { Cell, CellGroup, button } from 'vant';
    export default {
        components: {
            [Cell.name]: Cell,
            [CellGroup.name]: CellGroup,
            [button.name]: button,
        },
        data(){
            return {
                data: [
                    {
                        title: '账号与安全',
                    },{
                        title: '字体大小',
                        value: '中',
                    },{
                        title: '报价刷新',
                        value: '10s',
                    },{
                        title: '清理缓存',
                        value: '66.8M',
                    },{
                        title: '意见反馈',
                    },{
                        title: '推荐好友',
                    },{
                        title: '去App Store评分',
                    },{
                        title: '关于',
                        value: '版本号: 1.0.1',
                    }
                ]
            }
        },
        created(){
            this.$store.commit('hideNav', true);
        },
        methods: {
            onLogout() {
                this.$router.push('/user/login');
            }
        }
    }
</script>